import React, {Component} from "react";
import {Image, Text, View, Picker, Button} from "@tarojs/components";
import {AtInput,  AtButton, AtSteps, AtCheckbox} from 'taro-ui'
import Taro from "@tarojs/taro";


import './intelligentGuidance3.less'


class IntelligentGuidance3 extends Component{
  constructor () {
    super(...arguments)
    this.state = {
      checkedList: [],//不适症状
      current: 2,
      itemcode:''
    }
    this.checkboxOption = [{
      value: '头疼',
      label: '头疼'
    },{
      value: '口角歪斜',
      label: '口角歪斜',
    }, {
      value: '眼前发黑',
      label: '眼前发黑',
    },{
      value: '意识模糊',
      label: '意识模糊',
    }]
  }


  componentDidMount() {
    Taro.getStorage({
      key: '__itemcode__',
      success:(res)=> {
        this.setState({
          itemcode: res.data
        })
      }
    })
  }

  onChange (current) {
    this.setState({
      current
    })
  }

  handleChange (value) {
    this.setState({
      checkedList: value,
      value
    })
    return value
  }

  /*点击上一题*/
  toIntelligentGuidance2(){
    Taro.navigateTo({url:'/pages/intelligentGuidance/intelligentGuidance2'});
  }

  /*点击下一步*/
  toIntelligentGuidance4(){
    Taro.navigateTo({url:'/pages/intelligentGuidance/intelligentGuidance4'});
  }

  render(){
    const items = [
      {title: '已完成', status: 'success'},
      {title: '已完成', status: 'success'},
      {title: '进行中', status: '',icon:{
          value: 'chevron-down',
          activeColor: '#ff3041',
          inactiveColor: '#563cfa',
          size: '16',}},
      {title: '待进行',}
    ]
    return(
      <View>
        <View className='mar-step'>
          <AtSteps
            items={items}
            current={this.state.current}
            onChange={this.onChange.bind(this)}
          />
        </View>
        <View className='at-row row-border'>
          <Image className='at-col at-col-1 info-circle' />
          <View className='at-col at-col-11'>
            <AtInput
              disabled
              name='value'
              type='text'
              placeholderClass='input-font'
              placeholder='请选择不适症状'
            />
          </View>
        </View>
        <View className='at-col at-col-11'>
          <AtInput
            className='dia-pad-msg'
            disabled
            border={false}
            name='value'
            type='text'
            placeholderClass='input-font'
            placeholder='1、请选择症状'
            value={this.state.value}
            onChange={this.handleChange.bind(this)}
          />
        </View>
        <View>
          <AtCheckbox
            options={this.checkboxOption}
            selectedList={this.state.checkedList}
            onChange={this.handleChange.bind(this)}
          />
        </View>
        <View className='dia-btn'>
          <AtButton type='primary' className='dia-btn-left' onClick={this.toIntelligentGuidance2.bind(this)}>上一题</AtButton>
          <AtButton type='primary' className='dia-btn-right' onClick={this.toIntelligentGuidance4.bind(this)}>下一步</AtButton>
        </View>
      </View>
    )
  }
}

export default IntelligentGuidance3
